<template>
  <div v-if="store.auth.role!='学生'">
    <el-button class="mt-4" style="" @click="dialogVisible1=true" type="success">新增</el-button>
  </div>
  <div v-if="store.auth.role!='学生'">
    <el-input placeholder="学院" v-model="college" type="text" style="width: 140px"/>
    <el-input placeholder="课程类别名称" v-model="typeName" type="text" style="width: 140px"/>
    <el-button type="primary" @click="search">搜索</el-button>
  </div>
  <el-table :data="datas.slice((pageNum-1)*pageSize,pageNum*pageSize)" style="width: 100%" max-height="250" border>
    <el-table-column fixed label="序号" width="100">
      <template #default="scopes">
        {{ scopes.$index+1 }}
      </template>
    </el-table-column>
    <el-table-column fixed prop="college" label="学院" width="200" />
    <el-table-column fixed prop="typeFlag" label="课程类别标识" width="400" />
    <el-table-column fixed prop="typeName" label="课程类别" width="400" />
    <el-table-column fixed="right" label="操作" width="200">
      <template #default="scope">
        <div>
          <el-button
              v-show="scope.row.status == 1"
              link
              type="primary"
              size="small"
              @click.prevent="deleteRow(scope.$index)"
          >
            删除
          </el-button>
          <el-button
              link
              type="primary"
              size="small"
              @click.prevent="update(scope.row)"
          >
            修改
          </el-button>
        </div>
      </template>
    </el-table-column>
  </el-table>
  <el-dialog title="修改信息" v-model="dialogVisible">
    <el-form :model="stus">
      <el-input placeholder="学院" v-model="stus.college" type="text" disabled/>
      <el-input placeholder="课程类别标识" v-model="stus.typeFlag" type="text"/>
      <el-input placeholder="课程类别名称" v-model="stus.typeName" type="text" />
      <el-button type="warning" @click="dialogVisible=false">取消</el-button>
      <el-button type="primary" @click="updates">确认</el-button>
    </el-form>
  </el-dialog>
  <el-dialog title="新增课程类型" v-model="dialogVisible1">
    <el-form :model="stu">
      <el-input placeholder="学院" v-model="stu.college" type="text"/>
      <el-input placeholder="课程类别标识" v-model="stu.typeFlag" type="text" />
      <el-input placeholder="课程类别名称" v-model="stu.typeName" type="text" />
      <el-button type="warning" @click="dialogVisible1=false">取消</el-button>
      <el-button type="primary" @click="add">确认</el-button>
    </el-form>
  </el-dialog>
  <el-pagination
      background
      layout="sizes,prev,pager,next,jumper,->,total"
      :page-size.sync="pageSize"
      :current-page.sync="pageNum"
      :page-sizes="[5,8,10,15]"
      :total="totals"
      :hide-on-single-page="true"
      @current-change="getList"
      @size-change="getList1"
  />
</template>

<script setup>
import { get,post } from '@/utils/request.js'
import {ElMessage} from 'element-plus'
import { ref,onMounted } from 'vue'
import moment from 'moment';
import { reactive } from 'vue'
import {userStore} from '@/stores/counter.js'

const store=userStore()
const college=ref('')
const typeName=ref('')
const datas=ref([])
const totals=ref('')
const pageNum=ref(1)
const pageSize=ref(5)
const dialogVisible=ref(false)
const dialogVisible1=ref(false)

const stu = reactive({
  college:'',
  typeFlag:'',
  typeName:'',
})

const stus = reactive({
  id:'',
  college:'',
  typeFlag:'',
  typeName:'',
})

const findAll=()=>get('/courseType/getAll',(message)=>{
  let bbb=[]
  console.log("1121")
  if(store.auth.role=='管理员'){
    datas.value = message
    totals.value=message.length
  } else if(store.auth.role=='辅导员'){
    post('/teacher/getTeaByName',{name:store.auth.user},(messages)=>{
      datas.value=bbb.filter(item=>item.college===messages.college)
      totals.value=datas.value.length
    },(messages)=>{
      ElMessage.warning(messages)
    })
  }
},(message)=>{
  ElMessage.warning(message)
})

onMounted(()=>{
  findAll()
})

const deleteRow = (index) => {
  post('/courseType/delete',{
    id:datas.value[index].id
  },(message)=>{
    findAll()
    ElMessage.success(message)
  },(message)=>{
    ElMessage.warning(message)
  })
}

const update=(row)=>{
  stus.id=row.id
  stus.college=row.college
  stus.typeFlag=row.typeFlag
  stus.typeName=row.typeName
  dialogVisible.value=true
}

const updates=()=>{
  post('/courseType/update',{
    id:stus.id,
    college:stus.college,
    typeFlag:stus.typeFlag,
    typeName:stus.typeName
  },(message)=>{
    findAll()
    dialogVisible.value = false
    ElMessage.success(message)
  },(message)=>{
    dialogVisible.value = false
    ElMessage.warning(message)
  })
}

const search=()=>{
  post('/courseType/getByCondition',{
    college:college.value,
    typeName:typeName.value
  },(message)=>{
    datas.value = []
    datas.value = message
    college.value=''
    typeName.value=''
  },(message)=>{
    college.value=''
    typeName.value=''
    ElMessage.warning(message)
  })
}

const add=()=>{
  post('/courseType/add',{
    college:stu.college,
    typeFlag:stu.typeFlag,
    typeName:stu.typeName
  },(message)=>{
    ElMessage.success(message)
    dialogVisible1.value = false
    findAll()
    stu.college=''
    stu.typeFlag=''
    stu.typeName=''
  },(message)=>{
    ElMessage.warning(message)
    dialogVisible1.value = false
    stu.college=''
    stu.typeFlag=''
    stu.typeName=''
  })
}


const getList=(pageNums)=>{
  pageNum.value=pageNums
}

const getList1=(pageSizes)=>{
  pageSize.value=pageSizes
}
</script>

<style scoped>
</style>